"use client";
import { message, Select } from "antd";
import "./index.css";
import { API } from "@/api/typings";
import { getQuestionBankByPageUsingPost } from "@/api/questionBankController";
import React, { useEffect, useState } from "react";

interface Props {
}

/**
 * 题库下拉框
 * @param props
 * @constructor
 */
const QuestionBankSelect = (props: Props) => {
  // 题库列表
  const [questionBankList, setQuestionBankList] = useState<
    API.QuestionBankVO[]
  >([]);

  // 获取题库列表
  const getQuestionBankList = async () => {
    // 题库数量不多，直接全量获取
    const pageSize = 200;

    try {
      const res = await getQuestionBankByPageUsingPost({
        pageSize,
        sortField: "createTime",
        sortOrder: "desc",
      } as any);
      setQuestionBankList(res.data?.records ?? []);
    } catch (e: any) {
      message.error("获取题库列表失败，" + e.message);
    }
  };
  useEffect(() => {
    getQuestionBankList();
  }, []);

  return (
    <div className="questionBank-select">
      <Select
        style={{ width: "100%" }}
        options={questionBankList.map((questionBank) => {
          return {
            label: questionBank.title,
            value: questionBank.id,
          };
        })}
      />
    </div>
  );
};

export default QuestionBankSelect;
